<template>
	<view>
		<view class="mg-30  box-shadow border-rs20" v-if="listm.length">
			<view class="border-b d-flex-yCenter-sb pg-30">
				<view class="d-flex-yCenter title">
					<image src="../static/miaosha.png" mode=""></image>
					<text class="ml-10 miaosha">限时秒杀</text>
				</view>
				<navigator class="d-flex-yCenter" url='/goodsPackage/ms-list/ms-list' hover-class="none">
					<text class="font-24 text mr-10">更多</text>
					<u-icon name="arrow-right" color="#999" size="24"></u-icon>
				</navigator>
			</view>
			<view class="d-flex  flex-w jfy-sb px-30 pb-30 mt-10">
				<navigator :url="'/pages/prot_details/prot_details?cid='+item.goods_id" hover-class="hover-class"
					class="commodity-modul mt-20" v-for="(item,index) in listm" :key='index'>
					<view class="position-r">
						<text class="discount" v-if="item.flag && item.flag>0">{{item.flag}}折</text>
						<image :src="item.logo" mode="aspectFill"></image>
					</view>
					<text class="text-overflow2 font-28 mt-10 font-w">{{item.title}}</text>
					<view class="d-flex font-28 mt-10">
						<text class="Price-color">￥{{item.price_selling}}</text>
						<text class="text-decoration ml-20">￥{{item.price_market}}</text>
					</view>
				</navigator>
			</view>
		</view>
		<view class="mg-30  box-shadow border-rs20" v-if="listp.length">
			<view class="border-b d-flex-yCenter-sb pg-30">
				<view class="d-flex-yCenter title">
					<image src="../static/tuangou.png" mode=""></image>
					<text class="ml-10 miaosha">团购</text>
				</view>
				<navigator class="d-flex-yCenter" hover-class="none" url="/goodsPackage/Collage-list/Collage-list">
					<text class="font-24 text mr-10">更多</text>
					<u-icon name="arrow-right" color="#999" size="24"></u-icon>
				</navigator>
			</view>
			<view class="d-flex  flex-w jfy-sb px-30 pb-30 mt-10">
				<navigator :url="'/pages/prot_details/prot_details?cid='+item.goods_id" hover-class="hover-class"
					class="commodity-modul mt-20" v-for="(item,index) in listp" :key='index'>
					<view class="position-r">
						<text class="discount" v-if="item.flag && item.flag>0">{{item.flag}}折</text>
						<image :src="item.logo" mode="aspectFill"></image>
					</view>
					<text class="text-overflow2 font-28 mt-10 font-w">{{item.title}}</text>
					<view class="d-flex font-28 mt-10">
						<text class="Price-color">￥{{item.price_selling}}</text>
						<text class="text-decoration ml-20">￥{{item.price_market}}</text>
					</view>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	import { http_mall_activity_goods_seckill_lts , http_mall_pintuan_goods_lts} from '@/config/apiRouter.js'
	export default {
		data() {
			return {
				listm:[],
				listp:[],
			}
		},
		onLoad() {
			http_mall_activity_goods_seckill_lts({
				data:{
					limit:4,
				}
			}).then(res=>{
				this.listm=res.data.data
				console.log(res);
			})
			http_mall_pintuan_goods_lts({
				data:{
					limit:4,
				}
			}).then(res=>{
				this.listp=res.data.data
				console.log('拼团',res);
			})
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
page{
	height: 100%;
	background: #FAFAFA;
}
.title{
	image{
		width: 30rpx;
		height: 28rpx;
	}
	.miaosha{
		font-size: 32rpx;
		color: #FF0000;
		font-weight: bold;
	}
	.text{
		color: #999;
	}
}
	.commodity-modul {
		width: 300rpx;

		.discount {
			position: absolute;
			top: 20rpx;
			left: 20rpx;
			display: inline-block;
			padding: 6rpx 10rpx;
			border-radius: 8rpx;
			color: #fff;
			background: #FF890B;
		}

		image {
			width: 300rpx;
			height: 203rpx;
			border-radius: 12rpx;
		}
	}
</style>
